<!--
 * @Author: your name
 * @Date: 2021-10-07 20:34:00
 * @LastEditTime: 2021-10-18 20:08:18
 * @LastEditors: jerry.zzy
 * @Description: In User Settings Edit
 * @FilePath: \cang-chu-guan-li-xi-tong\src\views\chukuguanli\planToApply.vue
-->
<template>
  <div>
    <a-button type="primary" style="margin-top: 20px" @click="showModal">
      <a-icon type="plus" />
      根据源单生成
    </a-button>

    <a-modal
      title="采购计划生成出库申请单"
      :visible="visible"
      @ok="handleOk"
      @cancel="handleCancel"
      width="70%"
    >
      <a-table
        rowKey="id"
        style="margin-top: 10px"
        :columns="headColumns"
        :data-source="orderDataSource"
        :pagination="pagination"
        @change="handleTableChange"
        :row-selection="{
          selectedRowKeys: orderSelectedRowKeys,
          onChange: orderOnSelectChange,
          type: 'radio',
        }"
      >
      </a-table>
      <a-table
        style="margin-top: 10px"
        :columns="showgoods_columns"
        :locale="{ emptyText }"
        :data-source="ListDataSource"
        :row-selection="{
          selectedRowKeys: listSelectedRowKeys,
          onChange: listOnSelectChange,
        }"
      >
      </a-table>

      <!-- <secondTab ref="childMethod"> </secondTab> -->
    </a-modal>
  </div>
</template>
<script>
import { CaiGouRuKuHttp } from "@/services/modules/RuKuGuGuanLi/CaiGouRuKu";
const cgrkHttp = new CaiGouRuKuHttp(); // 采购入库

const showgoods_columns = [
  {
    title: "序号",
    align: "center",
    dataIndex: "key",
    key: "key",
  },
  {
    title: "存货编码",
    dataIndex: "inventoryNo",
    key: "inventoryNo",
    align: "center",
  },
  {
    title: "存货名称",
    dataIndex: "inventoryName",
    key: "inventoryName",
    align: "center",
  },
  {
    title: "规格型号",
    dataIndex: "specificationsModel",
    key: "specificationsModel",
    align: "center",
  },
  {
    title: "单位",
    dataIndex: "unit",
    key: "unit",
    align: "center",
  },
  {
    title: "申请采购数量",
    dataIndex: "applyNumber",
    key: "applyNumber",
    align: "center",
  },
  {
    title: "实有库存数量",
    dataIndex: "actualNumber",
    key: "actualNumber",
    align: "center",
  },
  {
    title: "建议采购数量",
    dataIndex: "suggestNumber",
    key: "suggestNumber",
    align: "center",
  },
  {
    title: "用途说明",
    dataIndex: "usageDescription",
    key: "usageDescription",
    align: "center",
  },
  {
    title: "备注",
    dataIndex: "remark",
    key: "remark",
    align: "center",
  },
  {
    title: "采购部备注",
    dataIndex: "purchaseDepartmentRemark",
    key: "purchaseDepartmentRemark",
    align: "center",
  },
  {
    title: "采购员",
    dataIndex: "purchaser_dictText",
    key: "purchaser_dictText",
    align: "center",
  },
];
const headColumns = [
  //外购订单
  {
    title: "序号",
    dataIndex: "key",
    align: "center",
    scopedSlots: { customRender: "key" },
  },
  {
    title: "提交日期",
    dataIndex: "submitTime",
    align: "center",
  },
  {
    title: "文件编号",
    dataIndex: "fileNumber",
    align: "center",
    scopedSlots: { customRender: "fileNumber" },
  },
  {
    title: "文件标题",
    dataIndex: "fileTitle",
    align: "center",
    scopedSlots: { customRender: "fileTitle" },
  },
  {
    title: "提交部门",
    dataIndex: "draftDepartment_dictText",
    align: "center",
    scopedSlots: { customRender: "draftDepartment_dictText" },
  },
  {
    title: "提交人",
    dataIndex: "submitter_dictText",
    align: "center",
    scopedSlots: { customRender: "submitter_dictText" },
  },
];

export default {
  data() {
    return {
      layout: {
        labelCol: { span: 5 },
        wrapperCol: { span: 15 },
      },
      //表格相关
      emptyText: "选择源单生成",
      showgoods_columns,
      headColumns,

      orderSelectedRowKeys: [], // 订单选择
      listSelectedRowKeys: [], // 存货选择

      orderDataSource: [],
      ListDataSource: [],

      //分页 查询相关
      queryCache: "",

      pagination: {
        total: 0,
        current: 1,
        pageSize: 5, //每页中显示5条数据
        showSizeChanger: true,
        pageSizeOptions: ["5"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
      },

      visible: false,
    };
  },
  mounted() {
    this.getPurchaserequest();
  },
  methods: {
    // 搜索
    Search() {
      // let { } = this.searchForm;
      let query = "";

      this.queryCache = query;
      this.pagination.current = 1;
      this.pagination.total = 0;
      this.pagination.pageSize = 5;
      this.getPurchaserequest(query);
    },
    //获取外购入库生成采购入库列表
    getPurchaserequest() {
      let _query = "?";
      _query += `pageNo=${this.pagination.current}`;
      _query += `&pageSize=${this.pagination.pageSize}`;
      _query += `&isTransfer=1`;

      cgrkHttp.getPurchaserequest(_query).then((res) => {
        this.pagination.current = Number(res.result.current);
        this.pagination.total = Number(res.result.total);
        this.pagination.pageSize = Number(res.result.size);

        let _data = res.result.records;
        _data.forEach((item, index) => {
          item.key = (res.result.current - 1) * 5 + index + 1;
        });

        this.orderDataSource = _data;
      });
    },
    // 表格选择事件,
    // jerry-fix:
    // 外购入库生成采购入库 - 上面表格的选中事件
    orderOnSelectChange(selectedRowKeys, selectedRows) {
      console.log(selectedRowKeys);
      console.log(selectedRows);
      this.orderSelectedRowKeys = selectedRowKeys;
      this.orderselectedRows = selectedRows;

      let id = selectedRows[0].purchaseRequestId;
      cgrkHttp.getPurchaserequestinfo("?id=" + id).then((res) => {
        console.log("采购入库根据源单生成表格选择事件res", res);
        let _data = res.result.object.purchaseGoodsList;
        _data.forEach((item, index) => {
          item.key = index + 1;
        });
        this.ListDataSource = _data;
      });
    },

    // 列表选择事件 rain:fix 重新进行直接赋值
    listOnSelectChange(selectedRowKeys, selectedRows) {
      console.log("下面的表格 selectedRows changed: ", selectedRows); //选中的数据
      this.listSelectedRowKeys = selectedRowKeys;
    },
    // 分页函数
    handleTableChange(pagination) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.getPurchaserequest(this.queryCache);
    },
    // 对话框取消
    handleCancel() {
      this.visible = false;
    },
    // 打开对话框
    showModal() {
      this.visible = true;
      this.getPurchaserequest();
    },
    // 对话框提交
    handleOk() {
      this.visible = false;

       this.$emit("origin-data",  this.orderDataSource ); //将子组件的数据，传递到父组件
      this.$emit("origin-data2", this.ListDataSource); //将子组件的数据，传递到父组件
    },
  },
};
</script>
